<template>
	<!-- 收款码 -->
	<view class="collection_wp">
		<!-- <view class="c_record" @click="$navTo('../business/collectionrecord')">门店收款记录 ></view> -->
		<image @longpress="tosave" class="c_image" :src="scr" mode="widthFix"></image>
		<view class="c_button" @click="tosave">保存海报</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				scr: '',
				uid: ''
			}
		},
		onLoad(options) {
			if(options.uid) this.uid = options.uid;
			this.getSrc();
		},
		methods: {
			getSrc(){
				this.$axios('Center/payCode','POST','member',{
					uid: this.uid
				}).then(res=>{
					if(res.data.code==200){
						this.scr=res.data.data;
					}
				})
			},
			tosave(e) {
				var that = this;
				uni.showModal({
					title: '海报保存',
					content: '确定要保存海报吗',
					success: e => {
						if (e['confirm']) {
							uni.downloadFile({
								url: that.scr,
								success: function(url) {
									uni.saveImageToPhotosAlbum({
										filePath: url.tempFilePath,
										success: function(e) {
											uni.showToast({
												title: '图片保存成功',
												icon: 'none',
												duration: 2200
											});
										},
									});
								},
								fail(e) {
									console.log(e)
								}
							});
							// uni.saveImageToPhotosAlbum({
							// 	filePath: that.scr,
							// 	success: function(e) {
							// 		uni.showToast({
							// 			title: '海报保存成功',
							// 			duration: 2200
							// 		});
							// 	},
							// 	fail(res) {
							// 		that.$api.msg(res.errMsg)
							// 	}
							// });
						}
					}
				});
			}
		}
	}
</script>

<style lang="scss">
	.collection_wp {
		position: relative;
		overflow: hidden;
		margin-top: -4px;
	}
	.c_record{
		color: #fff;
		position: absolute;
		top: 30upx;
		right: 40upx;
		font-weight: bold;
		font-size: 30upx;
	}

	.c_image {
		display: block;
		border-radius: 10upx;
		width: 100%;
	}

	.c_button {
		background: rgba(0,0,0,0.5);
		border-radius: 40upx;
		color: #fff;
		font-size: $font-sm;
		line-height: 40upx;
		letter-spacing: 2px;
		text-align: center;
		position: absolute;
		left: 50%;
		transform: translateX(-50%);
		bottom: 10upx;
		width: 150upx;
		z-index: 100;
	}
</style>
